<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>班级查询</title>
    <link rel="stylesheet" href="static/layui/css/layui.css">
    <link rel="stylesheet" href="static/css/common.css">
    <link rel="stylesheet" href="static/css/classInfo.css">
   	<script src="static/js/jquery-3.2.1.min.js"></script>
</head>
<body>
    <div class="content">
        <div class="content-btn-group">
            <button class="layui-btn theme-bg-blue" id="closeClass">
                <i class="layui-icon" style="color: #FFFFFF;">&#xe60b;</i> 关闭当前班级
            </button>
            <button class="layui-btn layui-btn-warm" id="closeAll">
                <i class="layui-icon" style="color: #FFFFFF;">&#xe60b;</i> 关闭所有桌面
            </button>
        </div>
        <div>
            <table id="studentTable" lay-filter="studentTable"></table>
        </div>
    </div>
    
    <script type="text/html" id="dockerStateTpl">
        {{#  if(d.dockerState==null||d.dockerState==0){ }}
			关闭
        {{#  } else { }}
			开启
        {{#  } }}   
	</script>
	
	<script type="text/html" id="dockerUIIDTpl">
        {{#  if(d.dockerState==null||d.dockerState==0){ }}
			
        {{#  } else { }}
			{{d.dockerUuid}}
        {{#  } }}   
	</script>
	
	<script type="text/html" id="dockerStarttimeTpl">
  		{{#  if(d.dockerState==null||d.dockerState==0){ }}
			
        {{#  } else { }}
			{{d.dockerStarttime}}
        {{#  } }} 
	</script>
	
	<script type="text/html" id="toolbar">
		{{#  if(d.dockerState==null||d.dockerState==0){ }}

        {{#  } else { }}
			<button class="layui-btn layui-btn-datatable" lay-event="close">断开连接</button>
        {{#  } }} 
    </script>

    <script src="static/layui/layui.js"></script>
    <script>
        layui.use(["table","element",'util','layer'], function(){
            var element=layui.element;
            var table = layui.table;
            var util = layui.util;
            var layer = layui.layer;
            $(function () {
            	var classname="${className}";
            	var pageOption={
            			limit:15,
            			limits:[5, 10, 15, 20, 30, 40 , 50]
            	};
            	table.render({
                    elem: '#studentTable'
                    ,height: "full-160"
                    ,url: 'getStudentData?className='+classname //数据接口
                    ,page: pageOption //开启分页
                    ,text: {
                        none: '暂无相关数据'
                      }
                    ,cols: [[ //表头
                         {type:"checkbox", width:"3%", fixed: 'left'}
                        ,{field: 'studentNo', title: '学号', sort: true, fixed: 'left'}
                        ,{field: 'studentPassword', title: '密码'}
                        ,{field: 'studentRealname', title: '姓名'}
                        ,{field: 'studentClassname', title: '班级'}
                        ,{field: 'dockerState', title: '状态', width:"5%", templet:'#dockerStateTpl'}
                        ,{field: 'dockerUuid', title: '桌面ID', width:"15%", templet:'#dockerUIIDTpl'}
                        ,{field: 'dockerStarttime', title: '开始时间', templet:'#dockerStarttimeTpl'}
                        ,{field: 'toolbar', title: '操作',align:'center', width:"15%", toolbar: '#toolbar',fixed: 'right'}
                    ]]
                });
            	
           	  table.on('tool(studentTable)', function(obj){
           		    var data = obj.data;
	           		 if(obj.event === 'close'){
	           	      layer.confirm("确定关闭吗?",["确定"],function(){
	           	    	  $.ajax({
	           	    		  url:"dockerCloseByName",
	           	    		  type:"GET",
	           	    		  data:"name="+data.studentNo+"&uiid="+data.dockerUuid,
	           	    		  success:function(res){
	           	    			  showMsg(res);
	           	    		  }
	           	    	  });
	           	      });
	           	    } 
           		});
           	  
	           	$("#closeClass").click(function () {
					layer.confirm("确定要当前班级的全部桌面吗?",["确定"],function(){
						$.ajax({
							url:"dockerCloseClass",
							data:"className="+classname,
							type:"GET",
							success:function(res){
								showMsg(res);
							}
						});
					});
				});
           	  
           	  	$("#closeAll").click(function () {
					layer.confirm("确定要关闭所有班级的全部桌面吗?",["确定"],function(){
						$.ajax({
							url:"dockerCloseAll",
							type:"GET",
							success:function(res){
								showMsg(res);
							}
						});
					});
				});
			});
            
            function showMsg(res) {
            	if (res.success) {
					layer.alert("关闭成功",function(){
	    					  window.location.reload();
	    				});
				}else{
					layer.alert("请求异常，刷新页面查看结果",function(){
	    					  window.location.reload();
	    			});
				}
			}
            
        });
    </script>
</body>
</html>